<template>
    <el-table :data="firsPartyList" border style="width: 100%">
      <el-table-column prop="partyName" label="甲方名称">
        <template slot-scope="scope">
          <el-input v-model="scope.row.partyName"></el-input>
        </template>
      </el-table-column>
      <el-table-column prop="partyPhone" label="甲方手机号">
        <template slot-scope="scope">
          <el-input v-model="scope.row.partyPhone"></el-input>
        </template>
      </el-table-column>
      <el-table-column prop="partyContacts" label="甲方联系人">
        <template slot-scope="scope">
          <el-input v-model="scope.row.partyContacts"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="300">
        <template slot-scope="scope">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete" size="mini"
            @click="handleDelete(scope.row, scope.$index)"
            v-if="scope.$index != 0"
          >
            删除
          </el-button>
          <el-button
            type="success"
            :plain="scope.row.whereDefault=='N'"
            icon="el-icon-setting"
            size="mini"
            @click="handleDefault(scope.row, scope.$index)">
            {{scope.row.whereDefault == 'Y' ? '取消默认' : '设为默认'}}
          </el-button>
          <el-button v-if="scope.$index == firsPartyList.length - 1" type="primary" plain icon="el-icon-plus" size="mini" @click="handleFamilyAdd">
          增加
          </el-button>
        </template>
      </el-table-column>
    </el-table>
</template>

<script>

  import { listFirstParty,delFirstParty} from "@/api/lease/firstParty";
  export default {
    name: "firstPartyList",
    data() {
      return {
        firsPartyList: [],
        currentlyOption:{}
      }
    },
    watch:{
      contractCategoryId(){
        this.getListFirstParty()
      }
    },
    created(){
      this.getListFirstParty()
    },
    methods: {
      getListFirstParty(){
        listFirstParty({contractCategoryId:this.contractCategoryId||-1}).then(res=>{
          this.firsPartyList = res.rows
          if(this.firsPartyList.length < 1){
            this.handleFamilyAdd()
          }
        })
      },
      handleFamilyAdd() {
        let obj = {
          id:null,
          contractCategoryId: this.contractCategoryId,
          partyName: null,
          partyPhone: null,
          partyContacts: null,
          whereDefault:'N'
        };
        this.firsPartyList.push(obj);
      },
      handleDefault(row,index){
        this.firsPartyList[index].whereDefault = 'Y'
        for(let i in this.firsPartyList){
          if(i != index){
            this.firsPartyList[i].whereDefault = 'N'
          }
        }
      },
      handleDelete(row,index){
        this.firsPartyList.splice(index,1)
        if(row.id){
          delFirstParty(row.id).then(res=>{})
        }
      },
      getFirsPartyList(){
        return this.firsPartyList
      }
    },
    props: {
      contractCategoryId: {
        type: String
      },
    }
  }
</script>

<style scoped>

</style>
